<template>
    <HeaderVue class="header">
        <div slot="left" class="header-left"></div>
        <div slot="center" class="header-title">网易云音乐</div>
        <div slot="right" class="header-right" @click.stop="$router.push({path:'/accout'})"></div>
    </HeaderVue>
</template>

<script>
import HeaderVue from './Header.vue'
export default {
  name: 'MainHeader',
  components:{
      HeaderVue
  }
}
</script>

<style scoped lang="scss">
 @import "../assets/css/variable";
 @import "../assets/css/mixin";
.header{
    .header-left{
        @include bg_img('../assets/images/logo');
        margin-bottom: 10px;
    }
    .header-right{
        @include bg_img("../assets/images/account")
    }
    .header-title{
        text-align: center;
        line-height: 100px;
        color: #fff;
        font-weight: bold;
        @include font_size($font_medium)
    }
}
</style>
